import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:o78k/api/http_client.dart';

const Color color = Color.fromARGB(94, 153, 151, 151);

class LeftHome extends StatefulWidget {
  const LeftHome({super.key});
  @override
  State<StatefulWidget> createState() => StateHome();
}

class LeftBar extends StatelessWidget {
  const LeftBar({super.key, required this.name, required this.icon});
  final String name;
  final Widget icon;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          height: 9,
          color: color,
        ),
        SizedBox(
            child: Column(
          children: [
            SizedBox(
              width: 55,
              height: 55,
              child: Center(
                child: icon,
              ),
            ),
            SizedBox(
              height: 35,
              child: Center(
                  child: Text(
                name,
                style:
                    const TextStyle(fontWeight: FontWeight.w200, fontSize: 16),
              )),
            )
          ],
        ))
      ],
    );
  }
}

class StateHome extends State<LeftHome> {
  List<Widget> lb = [];
  double width = 120;
  double hight = 65;
  int key = 0;
  initLb(data) {
    List d = json.decoder.convert(data);
    for (var element in d) {
      setState(() {
        key++;
        lb.add(LeftBar(
          name: element["name"],
          icon: Image.asset(element["url"]),
        ));
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    Http().getDate(initLb);
    return Row(
      children: [
        Container(
          width: width,
          height: MediaQuery.of(context).size.height - hight,
          color: const Color.fromARGB(50, 110, 110, 110),
          child: ListView(
            key: Key(key.toString()),
            children: lb,
          ),
        ),
        Container(
          width: MediaQuery.of(context).size.width - width,
          height: MediaQuery.of(context).size.height - hight,
          color: const Color.fromARGB(87, 139, 139, 139),
        )
      ],
    );
  }
}
